<!DOCTYPE html>

<html lang="en">

    <head>

		<meta charset="utf-8"/>
		<title>ball video</title>

		<script src="./aframe/dist/aframe-master.js"></script>
		<!-- <script src="./app/main.js"></script> -->

		<style>
			body {
				background-color: #000000;
			}
		</style>

	</head>

    <body>

		<a-scene>
			<a-assets>
			  	<video id="video_0" preload="auto" width="960" height="960" autoplay loop="false" crossOrigin="anonymous" muted></video>
				<video id="video_1" preload="auto" width="960" height="960" autoplay loop="false" crossOrigin="anonymous" muted></video>
				<video id="video_2" preload="auto" width="960" height="960" autoplay loop="false" crossOrigin="anonymous" muted></video>
				<video id="video_3" preload="auto" width="960" height="960" autoplay loop="false" crossOrigin="anonymous" muted></video>
				<video id="video_4" preload="auto" width="960" height="960" autoplay loop="false" crossOrigin="anonymous" muted></video>
				<video id="video_5" preload="auto" width="960" height="960" autoplay loop="false" crossOrigin="anonymous" muted></video>
				<audio id="audio"></audio>
			</a-assets>

			<a-entity material="shader: flat; src: #video_0"
					  geometry="primitive: plane; width: 960; height: 960;"
					  position="480 0 0"
					  rotation="0 270 0"
					  visible="true">
			</a-entity>

			<a-entity material="shader: flat; src: #video_1"
					  geometry="primitive: plane; width: 960; height: 960;"
					  position="-480 0 0"
					  rotation="0 90 0"
					  visible="true">
			</a-entity>

			<a-entity material="shader: flat; src: #video_2"
					  geometry="primitive: plane; width: 960; height: 960;"
					  position="0 480 0"
					  rotation="90 0 0"
					  visible="true">
			</a-entity>
			<a-entity material="shader: flat; src: #video_3"
					  geometry="primitive: plane; width: 960; height: 960;"
					  position="0 -480 0"
					  rotation="-90 0 0"
					  visible="true">
			</a-entity>
			<a-entity material="shader: flat; src: #video_4"
					  geometry="primitive: plane; width: 960; height: 960;"
					  position="0 0 -480"
					  rotation="0 0 0"
					  visible="true">
			</a-entity>
			<a-entity material="shader: flat; src: #video_5"
					  geometry="primitive: plane; width: 960; height: 960;"
					  position="0 0 480"
					  rotation="0 180 0"
					  visible="true">
			</a-entity>
			<a-entity material="shader: flat; src: #audio"
					  geometry="primitive: plane; width: 0; height: 0;"
					  position="0 0 0"
					  rotation="0 0 0"
					  visible="true">
			</a-entity>

		</a-scene>

	</body>

</html>
